<template>
	<view class=" bg-white">
		<view class="padding text-bold margin-left">
			<cl-text value="最近清单" :size="32"></cl-text>
		</view>
		<cl-list :border="false">
			<cl-list-item justify="start" swipe="right" v-for="(item,index) in 10" :key="index">
				<view style="width: 100%;" class=" padding-left-sm padding-right-sm">
					<view class="flex align-center padding-top-xs padding-bottom-xs">
						<image src="../../static/tag/heart.png" class="icon"></image>
						<text class="text-lg margin-left-sm">01月{{20+index}}日清单</text>
					</view>
					<cl-progress :value="10*index" :color="['#F56C6C', '#E6A23C', '#67C23A']" :showText="false" :strokeWidth="4"></cl-progress>
				</view>
				<view class="append flex" slot="menu">
						<button class="primary-btn bg-green">置顶</button>
						<button class="error-btn bg-red">删除</button>
				</view>
			</cl-list-item>
	
		</cl-list>
	</view>
</template>

<script>
	export default{
		name:'home',
		data(){
			return {
				
			}
		}
	}
</script>

<style>
	page{
		background-color: #fff;
	}
	
	.icon{
		width: 36upx;
		height: 36upx;
	}
	.primary-btn,.error-btn{
		border: 0 !important;
		border-radius: 0 !important;
	}
	.primary-btn{
		
	}
	
	
</style>
